<template>
    <div id="UserManage">
        <div class="title">
            <img src="../../assets/AIGCDetail/icon2.png" alt="icon">
            <span>学生列表</span>
        </div>
        <div class="search clearfix">
            <div class="search-area">
                <input type="text" name="search" placeholder="请输入关键词">
                <input type="button" name="To-search" value="搜索">
            </div>
        </div>
        <div class="show">
            <ul>
                <li class="list-data">
                    <template>
                        <el-table :data="tableData" style="width: 100%"
                            :header-cell-style="{ 'background-color': '#CECECE', 'color': '#101010' }">
                            <el-table-column prop="userID" label="用户ID" width="100" align="center">
                            </el-table-column>
                            <el-table-column prop="admin" label="用户名" width="130" align="center">
                            </el-table-column>
                            <el-table-column prop="name" label="学校" width="120" align="center">
                            </el-table-column>
                            <el-table-column prop="musicStyle" label="学院" width="150" align="center">
                            </el-table-column>
                            <el-table-column prop="role" label="专业" width="110" align="center">
                            </el-table-column>
                            <el-table-column prop="role" label="专业排名" width="110" align="center">
                            </el-table-column>
                            <el-table-column prop="role" label="研究方向" width="110" align="center">
                            </el-table-column>
                            <el-table-column prop="role" label="发表论文数" width="110" align="center">
                            </el-table-column>
                            <el-table-column prop="role" label="兴趣爱好" width="110" align="center">
                            </el-table-column>
                            <el-table-column prop="phone" label="手机" width="180" align="center">
                            </el-table-column>
                            <el-table-column label="邮箱" width="150" align="center">
                                <img src="../../assets/AIGCDetail/icon1.png" alt="图片">
                            </el-table-column>
                            <el-table-column label="操作" width="160" align="center">
                                <template slot-scope="scope">
                                    <el-button @click="handleClick(scope.row)" type="text" size="small">注销</el-button>
                                    <el-button @click="handleClick(scope.row)" type="text" size="small">解锁</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </template>
                </li>
            </ul>
            <div class="block">
                <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                    :current-page.sync="currentPage3" :page-size="100" layout="prev, pager, next, jumper" :total="1000">
                </el-pagination>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    // name:'index',
    data() {
        return {
            tableData: [],
            userList: [],
            typeId: 0
        }
    },
    methods: {
        UserGet() {
            var url = "http://124.222.205.62:8081/user/selectAlluser"
            console.log(url)
            this.$axios({
                method: "post",
                url: url
            })
                .then(response => {
                    this.userList = response.data.data
                    console.log(response)
                    for (var i = 0; i < 5; i++) {
                        console.log(i)
                        var l = ["浪漫、舒缓", "摇滚", "电子音乐", "流行音乐", "流行音乐"]
                        var ro = ["音乐创作者", "音乐收藏者", "管理员", "音乐创作者", "音乐收藏者"]
                        var s = ["正常", "正常", "正常", "正常", "正常"]
                        var flag = {
                            userID: this.userList[i].id,
                            admin: this.userList[i].bankAccount,
                            name: this.userList[i].realName,
                            musicStyle: l[i],
                            role: ro[i],
                            phone: this.userList[i].phone,
                            state: s[i],
                        }
                        this.tableData.push(flag)
                    }
                })
                .catch(function (err) {
                    console.log(err);
                });
        }
    },
    mounted() {
        this.UserGet()
    },
    beforeCreate() {
        //   location.reload();
    },
    created() {
        // location.reload();
    }

}
</script>

<style scoped>
@import '../../style/UserManage.css';
</style>
